<template>
  <div class="login flex-center02">
    <div class="input-msg">
      <div class="login-input" id="app">
        <div class="logo">
          后台登录
        </div>
        <div class="login-user">
          <el-form :model="params" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <el-form-item prop="account" label-width='0'>
              <div class="posi-abso top0 left0 bottom0 width40 flex-center02 z11">
                <i class="el-icon-user-solid c-gray fs20"></i>
              </div>
              <el-input v-model="params.account" placeholder="请输入账号"></el-input>
            </el-form-item>
            <el-form-item class="mt20" prop="password" label-width='0'>
              <div class="posi-abso top0 left0 bottom0 width40 flex-center02 z11">
                <i class="el-icon-s-goods c-gray fs20"></i>
              </div>
              <el-input type="password" v-model="params.password" placeholder="请输入密码"></el-input>
            </el-form-item>
            <el-button class="widthp100 mt20" type="primary" @click="login('ruleForm')">登录</el-button>
          </el-form>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import vuex from '../store/index.js';
  import {_login} from '@/request/api'; // 导入我们的api接口
  /* import login from '../request/api' */
  export default {
    name: 'HelloWorld',
    data: function() {
      return {
        msg: 'Welcome to Your Vue.js App 000',
        input: '请输入姓名',
        curId: 0,
        params: {
          account: '',
          password: ''
        },
        rules: {
          account: [{
            required: true,
            message: '请输入用户账号',
            trigger: 'blur'
          }],
          password: [{
            required: true,
            message: '请输入用户密码',
            trigger: 'blur'
          }]
        }
      }
    },
    created: function() {
      let userInfo=JSON.parse(sessionStorage.getItem('userInfo'));
      if(userInfo){
        this.params=userInfo;
      };
    },
    mounted: function() {
      console.log(this.global_.baseurl);
      console.log(this.$qs);
      //this.$common.message('开心');
    },
    methods: {
      addDelStatus: function(index) {
        this.curId = index
      },
      login(ruleForm) {
        let that = this;
        console.log(ruleForm);
        //return false
        this.$refs[ruleForm].validate((valid) => {
          if (valid) {
            //alert('submit!');
            _login(that.params).then(res => {
              console.log(res);
              if (res.code) {
                let tokenInfo = res.data;
                console.log(tokenInfo.accessToken);
                vuex.stores.commit("freshtoken", tokenInfo.accessToken);
                sessionStorage.setItem('userInfo', JSON.stringify(that.params));
                sessionStorage.setItem('tokenInfo', JSON.stringify(tokenInfo));
								sessionStorage.setItem('userInfo', JSON.stringify(this.params));
								let routerName=sessionStorage.getItem('routerName');
                console.log(routerName);
                if(routerName){
                  this.$router.push({
                    name: routerName
                  });
                }else{
                  this.$router.push({
                    name: 'default'
                  });
                };

              } else {

              }
            });
          } else {
            console.log('error submit!!');
            return false;
          }
        });

        /* let formdata=new FormData();
          formdata.append('account',this.resArr[0].text);
          formdata.append('password',this.resArr[1].text);

        let _data={url:'/admin/role/login',data:formdata}
        utils.login.call(_data,(res)=>{
          console.log(res);
          if(res.data.code===200){
            let tokenInfo=res.data.data;
            sessionStorage.setItem('tokenInfo',JSON.stringify(tokenInfo));
            this.$router.push({ path: '/home' });
          };
        }) */

      }
    },
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .login {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 11;
    overflow-y: auto;
    background-position: center center;
    background-color: #2d3a4b;
    background-size: cover;
  }

  .input-msg {
    width: 330px;
    box-sizing: border-box;
  }

  .logo {
    color: #fff;
    font-size: 24px;
    text-align: center;
    padding: 20px 0;
  }
  .el-input__inner{padding-left: 40px;background-color: transparent}

</style>
